﻿<template id="@(ViewBag.GetCompTemplate("power"))">
    <el-dialog v-model="visible" :width="1200" :title="title" :destroy-on-close="true" :close-on-click-modal="false" :close-on-press-escape="false" draggable v-on:close="closed">
        <el-divider class="layout-page-form-top-border"></el-divider>
        <single_table :api="`${path}/getpower`" :height="500" :base-query="{id}" :is-tree="true" :default-expand-all="true" :border="true" row-key="Id" ref="rmfRef" :hide-header-right="true">
            <template #header-left="scope">
                <el-button type="warning" v-on:click="selectAll">全部选中</el-button>
                <el-button type="danger" plain v-on:click="unSelectAll">全部取消</el-button>
                <el-button type="primary" v-on:click="expandAll">全部展开</el-button>
                <el-button type="primary" plain v-on:click="collapseAll">全部折叠</el-button>
            </template>
            <template #header-right="scope">
                <el-button icon="Refresh" v-on:click="reset">重置</el-button>
            </template>
            <template #default>
                <el-table-column prop="Title" label="菜单名称" width="200"></el-table-column>
                <el-table-column label="权限内容">
                    <template #default="scope">
                        <el-checkbox v-for="item in scope.row.PowerList" :key="item.Id" v-model="item.Exist" class="power-row-check">
                            <el-icon v-if="item.Icon">
                                <component :is="item.Icon"></component>
                            </el-icon>
                            <span>{{item.Title}}</span>
                            <span v-if="item.Type=='tools'">(S)</span>
                        </el-checkbox>
                    </template>
                </el-table-column>
                <single_table_operation>
                    <template #default="scope">
                        <el-button type="primary" icon="Select" link v-on:click="checkRow(scope.row, true)">全选</el-button>
                        <el-button type="danger" icon="Delete" link v-on:click="checkRow(scope.row, false)">取消</el-button>
                    </template>
                </single_table_operation>
            </template>
        </single_table>
        <template #footer>
            <el-button v-on:click="close">取消</el-button>
            <el-button type="primary" v-on:click="submit">确定</el-button>
        </template>
    </el-dialog>
</template>
<script type="text/javascript">
    var @(ViewBag.GetCompName("power")) = {
        template: "#@(ViewBag.GetCompTemplate("power"))", data() {
            return {
                path: "@(ViewBag.PagePath)",
                visible: false,
                title: null,
                id: null
            }
        },
        methods: {
            open(row){
                var that = this;
                that.id = row.Id;
                that.title = `配置权限（${row.Title}）`;
                that.visible = true;
            },
            close(){
                this.visible = false;
            },
            closed(){
                this.id = null;
                this.title = null;
            },
            submit(){
                var that = this;
                var pushList = (items) => {
                    var list = [];
                    for (var item of items) {
                        for (var mf of item.PowerList) {
                            if (mf.Exist) { list.push(mf.Id); }
                        }
                        if (item.children) {
                            list = list.concat(pushList(item.children));
                        }
                    }
                    return list;
                };
                var mfIds = pushList(that.$refs.rmfRef.processTableData);
                app.func.submit(`${that.path}/setpower`, { roleId: that.id, mfIds }, that.close);
            },
            checkRow(row, bit){
                var that = this;
                row.PowerList.forEach(m => { m.Exist = bit; });
                if (row.children) {
                    row.children.forEach(m => that.checkRow(m, bit));
                }
            },
            select(rows, bit){
                var that = this;
                rows.forEach(m => {
                    that.checkRow(m, bit);
                    if (m.children) {
                        that.select(m.children, bit);
                    }
                });
            },
            selectAll(){
                this.select(this.$refs.rmfRef.processTableData, true);
            },
            unSelectAll(){
                this.select(this.$refs.rmfRef.processTableData, false);
            },
            expand(rows, bit){
                var that = this;
                rows.forEach(m => {
                    that.$refs.rmfRef.toggleRowExpansion(m, bit);
                    if (m.children) {
                        that.expand(m.children, bit);
                    }
                });
            },
            expandAll(){
                this.expand(this.$refs.rmfRef.processTableData, true);
            },
            collapseAll(){
                this.expand(this.$refs.rmfRef.processTableData, false);
            },
            reset(){
                this.$refs.rmfRef.loadData();
            }
        },
        mounted() { }
    };
</script>